<template>
	<div class="p-coopera">
		<!-- 合作申请 用户信息 -->
		<v-info :resource="resource"></v-info>
		<v-userHz :type = 0></v-userHz>
		<!-- <div class="company-coopera-content">
			<div class="company-coopera-head flexItems">
				<div class="company-coopera-date flexItems">
					<span class="h66">{{$t('common.company.submitTime')}}：</span>
					<el-date-picker
						v-model="date"
						value-format="yyyy-MM-dd HH:mm:ss"
						type="monthrange"
						range-separator="~"
						:start-placeholder="$t('common.resume.start')"
						:end-placeholder="$t('common.resume.end')"
						@change='handleDateChange'
					></el-date-picker>
				</div>
				<div class="company-coopera-checkout">
					<el-checkbox-group v-model="checkList" @change="bindCheckout">
						<el-checkbox label="1">{{$t('common.policy.unhandle')}}</el-checkbox>
						<el-checkbox label="2">{{$t('common.policy.handled')}}</el-checkbox>
					</el-checkbox-group>
				</div>
			</div>

			<div class="company-coopera-foot flex">
				<div class="company-coopera-left">
					<div class="company-coopera-list">
						<div
							class="company-coopera-item"
							v-for="(item, idx) in records"
							:key="idx"
							:class="{ 'company-coopera-item-On': cooperaIndex == idx }"
							@click="bindCoopera(idx)"
						>
							<div class="company-coopera-item-box">
								<div class="company-coopera-item-title">{{item.description}}</div>
								<div class="company-coopera-item-cont flexBetween">
									<span class="font12 h99">[{{$t('common.policy.consult')}}]</span>
									<span class="font12 h99">{{item.createTime}}</span>
									<span class="font12 color1" v-if="item.status==2">{{$t('common.policy.handled')}}</span>
									<span class="font12 color1" v-else>{{$t('common.policy.unhandle')}}</span>
								</div>
							</div>
						</div>
					</div>
					<div class="tipBox" v-if="total == 0">{{$t('news.listTip')}}</div>
					<div class="company-coopera-page" v-if="total<pageSize">
						<el-pagination :current-page="pageNo" :page-size="pageSize" layout="total, jumper, prev, next" :total="total" @current-change="handleCurrentChange"></el-pagination>
					</div>
				</div>
				<div class="company-coopera-right" v-if="detail.userName.length>0">
					<div class="company-coopera-right-infomation flexItems">
						<div class="photo" v-if="detail.headPicture"><img :src="imgUrl + detail.headPicture" alt="" /></div>
						<div class="text">
							<p class="font20">{{detail.userName}}</p>
							<p class="font14">
								{{detail.sex}}
								<span>|</span>
								{{detail.telentType}}
								<span>|</span>
								{{detail.topUniversity}}
							</p>
						</div>
					</div>
					<div class="company-coopera-right-box">
						<div class="zmlTitle">{{$t('common.company.feedbackInfo')}}</div>
						<div class="company-coopera-right-box-content clearfix">
							<div class="text-box">{{$t('common.company.name')}}：{{detail.name}}</div>
							<div class="text-box">{{$t('common.company.submitTime')}}：{{detail.createTime}}</div>
							<div class="text-box">{{$t('common.company.phone')}}：{{detail.phone}}</div>
							<div class="text-box">{{$t('common.company.submitType')}}：{{detail.terminal}}</div>
						</div>
					</div>
					<div class="company-coopera-right-box">
						<div class="zmlTitle">{{$t('common.company.feedbackDetail')}}</div>
						<div class="company-coopera-right-box-content">
							<p>{{detail.description}}</p>
						</div>
					</div>
					<div class="company-coopera-right-box">
						<div class="zmlTitle">{{$t('common.company.feedbackSitua')}}</div>
						<div class="company-coopera-right-box-content">
							<p>{{detail.status}}</p>
							<p>{{detail.auditOpinion}}</p>
						</div>
					</div>
				</div>
			</div>
		</div> -->
	</div>
</template>
<script>
import { ajax, ajaxAdd } from '@/utils/js.js';
import { cooperationList, cooperationDetail, resumeDetail } from '@/services/api.js';
const log = console.log;
import info from '@/components/userInfo.vue'
import userHz from '@/components/userHz.vue'
export default {
	components:{
		'v-info':info,
		'v-userHz':userHz
	},
	data() {
		return {
			resource: {},
			imgUrl: this.$store.state.imgUrl,
			date: '',
			checkList: [], //['1', '2']

			data: {}, //res.data
			records: [],

			cooperaIndex: 0, //高亮item
			pageNo: 1,
			pageSize: 10,
			detail: {userName:''}, //详情数据
		};
	},

	mounted() {
		this.content();
	},
	watch: {
		'$i18n.locale'() {
			this.content();
		}
	},
	methods: {
		content() {
			//简历详情
			ajaxAdd(this, resumeDetail, {}, res => {
				log('简历详情',res.data.resource)
				//基本信息
				if (res.data.resource && Object.getOwnPropertyNames(res.data.resource).length > 0) {
					this.resource = res.data.resource;
				}
			});
		},
	}
};
</script>
<style lang="scss">
.company-coopera-content {
	width: 100%;
	min-height: 800px;
	background-color: #fff;
	margin-top: 20px;
	padding: 0 22px;
	.company-coopera-head {
		border-bottom: 1px solid #d1d1d1;
		.company-coopera-date {
			padding: 20px 0;
		}
		.company-coopera-checkout {
			padding-left: 60px;
		}
	}
	.company-coopera-foot {
		padding: 20px 0;
		.company-coopera-left {
			width: 300px;
			.company-coopera-list {
				.company-coopera-item {
					background-color: #f5f5f5;
					padding: 0 20px;
					cursor: pointer;
					border-right: 2px solid transparent;
					.company-coopera-item-box {
						padding: 20px 0;
						border-bottom: 1px solid #d1d1d1;
						.company-coopera-item-title {
							overflow: hidden;
							text-overflow: ellipsis;
							white-space: nowrap;
							font-weight: bold;
							margin-bottom: 10px;
						}
					}
				}
				.company-coopera-item:nth-last-of-type(1) .company-coopera-item-box {
					border-bottom: 0;
				}
				.company-coopera-item-On {
					background-color: #ffffff;
					border-right: 2px solid #0f54bc;
				}
			}
			.company-coopera-page {
				padding-top: 12px;
				.el-pagination__jump {
					margin-right: 24px;
				}
			}
		}
		.company-coopera-right {
			flex: 1;
			padding-left: 20px;
			.company-coopera-right-infomation {
				padding-bottom: 30px;
				.photo {
					width: 80px;
					height: 80px;
					overflow: hidden;
					background-color: #9f9f9f;
					img {
						width: 100%;
					}
				}
				.text {
					flex: 1;
					padding-left: 16px;
					p {
						margin: 15px 0;
					}
				}
			}
			.company-coopera-right-box {
				padding: 30px 0;
				border-top: 1px solid #d1d1d1;
				.zmlTitle {
					padding: 0 0 0 16px;
					margin-bottom: 20px;
				}
				.company-coopera-right-box-content {
					padding-left: 16px;
					p {
						color: #666;
						line-height: 22px;
					}
					.text-box {
						width: 50%;
						float: left;
						margin: 6px 0;
					}
				}
			}
		}
	}
}
</style>
